<template>
  <div class="xd-LearningHome-OnlineExamsItemHome">
    <el-card class="box-card" shadow="hover">
      <div slot="header" class="title">考试列表</div>
      <ExamItemInfo
        :paperInfo="paperInfo"
        @click="openPaper"
        @size-change="paperSizeChange"
        @page-change="paperPageChange"
      ></ExamItemInfo>
    </el-card>

    <el-card class="box-card" shadow="hover">
      <div slot="header" class="title">闯关答题</div>
      <ExamItemInfo
        :paperInfo="throughInfo"
        @click="openThrough"
        @size-change="throughSizeChange"
        @page-change="throughPageChange"
      ></ExamItemInfo>
    </el-card>
  </div>
</template>
<script>
const ExamItemInfo = () => import('@/components/ExamItemInfo')

export default {
  name: 'OnlineExamsItemHome',
  components: {
    ExamItemInfo
  },
  data() {
    return {
      paperInfo: {
        total: 10,
        page: 1,
        size: 5,
        list: []
      },
      throughInfo: {
        total: 10,
        page: 1,
        size: 5,
        list: []
      }
    }
  },
  mounted() {
    this.$store.commit('updateActiveMenu', '/LearningHome/OnlineExams')
    for (let index = 0; index < 5; index++) {
      this.paperInfo.list.push({
        id: index,
        title: '学习头条',
        statusText: index % 2 === 0 ? '考试中' : '已通过',
        status: index % 2 === 0 ? 1 : 2,
        typeName: '固定考试',
        total: 5,
        score: 60,
        times: 30,
        creator: '系统管理员',
        createTime: new Date().toLocaleDateString(),
        imgUrl: require('../../../assets/imgs/demo_img.png')
      })
      this.throughInfo.list.push(
        {
          id: index,
          title: '学习头条',
          statusText: index % 2 === 0 ? '考试中' : '已通过',
          status: index % 2 === 0 ? 1 : 2,
          typeName: '固定考试',
          total: 5,
          score: 60,
          times: 30,
          creator: '系统管理员',
          createTime: new Date().toLocaleDateString(),
          imgUrl: require('../../../assets/imgs/demo_img.png')
        }
      )
    }
  },
  methods: {
    openPaper(item) {
      this.$router.push('/LearningHome/OnlineExams/ExamCenter')
    },
    getPaperList() {
      utils.post(utils.api.onlineExam.list, { page: this.paperInfo.page, size: this.paperInfo.size }, res => {
        if (res.success) {
          this.paperInfo.paperList = res.data.rows
        }
      })
    },
    paperSizeChange(val) {
      this.paperInfo.size = val
      this.getPaperList()
    },
    paperPageChange(val) {
      this.paperInfo.page = val
      this.getPaperList()
    },
    openThrough(item) {
      console.log(item)
      this.$router.push('')
    },
    getThroughList() {
      utils.post(utils.api.onlineExam.list, { page: this.throughInfo.page, size: this.throughInfo.size }, res => {
        if (res.success) {
          this.throughInfo.throughList = res.data.rows
        }
      })
    },
    throughSizeChange(val) {
      this.throughInfo.size = val
      this.getThroughList()
    },
    throughPageChange(val) {
      this.throughInfo.page = val
      this.getThroughList()
    }
  }
}
</script>
<style lang="less">
.xd-LearningHome-OnlineExamsItemHome {
  padding: 10px;
  .el-card {
    margin-bottom: 1.04vw;
  }
}
</style>